    {meta_html js $j_basepath.'design/front/js/popup.js'}

{$google_map_header}
{$google_map_js}

	<!--[if lte IE 9]>
		<link rel="stylesheet" href="{$j_basepath}design/front/css/ie9.css" type="text/css" />                            
	<![endif]-->
	<!--[if lte IE 8]>
		<link rel="stylesheet" href="{$j_basepath}design/front/css/ie8.css" type="text/css" />                            
	<![endif]-->

{literal}
    <style type="text/css">
      v\:* {ldelim}
        behavior:url(#default#VML);
     {rdelim} 
     
     #gallery div#slideshow img {
         width:359px !important;
         /*height:299px;*/
         overflow:hidden !important;
     }
    </style>
    <script type='text/javascript'>
        $(function(){
            switchThumbs($('#forPop a:first').attr('href'), "");
            $("#thumbs ul.thumbs a img").click(function(){
                switchThumbs($(this).attr('src'), $('.showpopin').attr('href'));
            });
            $('.showpopin').click(function () {
                $('#masque').hide();
                $('.pop-up').hide();
            });

        });
        function switchThumbs(srcClick, srcZoom){
            
            if (srcZoom != srcClick ){
                var contentOfDiv = "";
                $('.showpopin').attr('href',srcClick);
                if(srcZoom != ""){
                    contentOfDiv += '<a rel="prettyPhoto[pp_gal]" class="thumb" href="'+srcZoom+'" >';
                    contentOfDiv += '<img  src="'+srcZoom+'" width="60" height="60"/>';
                    contentOfDiv += '</a>';
                }
                
                $('#forPop a').each(function(){
                    if ($(this).attr('href') != srcClick ){
                        contentOfDiv += '<a rel="prettyPhoto[pp_gal]" class="thumb" href="'+$(this).attr('href')+'" >';
                        contentOfDiv += '<img  src="'+$(this).attr('href')+'" width="60" height="60"/>';
                        contentOfDiv += '</a>';
                    }
                });
                $("#forPop").html(contentOfDiv);
                $("a[rel^='prettyPhoto']").prettyPhoto({
                    social_tools: ''
                });
            }
        }
    </script>
{/literal}

<div id="global" class="search">
  {$oZoneHeader}
  <div id="main">
    {$oZoneBreadCrumb}
    <div class="linkHaut">{if isset($page->prec) && $page->prec}<a  href="{jurl 'recherche~FoFiche:index', array('id'=>$page->prec)}" >Fiche précédente</a>{/if}<a href="{jurl 'recherche~FoRecherche:index'}">Retour liste</a>{if isset($page->suiv) && $page->suiv}<a class="last"  href="{jurl 'recherche~FoFiche:index', array('id'=>$page->suiv)}">Fiche Suivante</a>{/if}</div>
    <div id="leftContent2">
    	<div id="prod">
        	<div class="annonce"><h2><a href="{jurl 'recherche~FoRecherche:index', array('marque'=>$annonce->Occas_Marque)}">{$annonce->marque_libelle}</a> <a href="{jurl 'recherche~FoRecherche:index', array('modele'=>$annonce->Occas_Modele)}">{$annonce->modele_libelle}</a></h2> <span>{$annonce->Occas_Version|truncate:36}</span><span class="prix">{$annonce->Occas_Prix} € </span></div>
            <div class="leftItem">
            	<div class="wrap">
               
                    	<div class="options">
                        	<p>{if $annonce->Occas_Kilometrage}{$annonce->Occas_Kilometrage} Km {/if} {if $annonce->Occas_Kilom_Moteur}{$annonce->Occas_Kilom_Moteur} Km moteur{/if}</p>
                            {if $annonce->carburation > 0}<p>{$annonce->carburation}</p>{/if}
                            {if $annonce->Occas_Millesime}<p>{$annonce->Occas_Millesime}</p>{/if}
                            <p><a href="{jurl 'recherche~FoRecherche:index', array('region'=>$annonce->region, 'fm'=>1)}">{$annonce->region}</a> - <a href="{jurl 'recherche~FoRecherche:index', array('dept'=>$annonce->departement_num, 'fm'=>2)}">{$annonce->departement_nom}</a> ({$annonce->departement_num}) </p>
                            <div class="detail">
                            	<ul>
                                	<li>Boite {$annonce->vitesse}</li>
                                    <li>{$annonce->Occas_NbPorte} portes</li>
                                    <li>{$annonce->Occas_Couleur}</li>
                                </ul>
                            </div>
                                  <p>&nbsp;<a href="#" class="showFicheInterdit">&nbsp;</a></p> <!-- useful for pop when advert not valid-->
                      </div>
                        <div class="deco">&nbsp;</div>
                        {if sizeof($equipement)}
                        <div class="equipement">
                        	<h3>Equipements de série</h3>
                            {assign $k = 1}
                            {foreach $equipement as $item}
                            
                            <ul class="e{$k}">
                            	<li class="titre"><span>{$item->categ}</span></li>
                                {if sizeof($item->equipment)}
                                    {foreach $item->equipment as $val}
                                        <li>{$val}</li>
                                    {/foreach}
                                {/if}
                            </ul>
                            {if $k == 2} {assign $k = 1} {else} {assign $k++} {/if}
                            
                            {/foreach}
                        </div>
                        {/if}
                    <!--end content-->
                </div>
            </div>
             <!--end leftItem-->
             <div class="rightItem">
             	<div style="width:361px; overflow:hidden; position:relative; margin:0 0 10px;float:right;">
                    <!--begin gallery-->
                    <div id="gallery">
                      <div id="controls" class="controls"></div>
                      <div class="slideshow-container">
                        <div id="loading" class="loader"></div>
                        <div id="slideshow" class="slideshow"></div>
                      </div>
                      <div id="caption" class="caption-container"></div>
                    </div>
                    <div id="thumbs" class="navigation">
                      <ul class="thumbs" style="width:324px; overflow:hidden;">
                        {if sizeof($photo)}
                            {foreach $photo as $itemPhoto}
                                {if $itemPhoto->photo_name}
                                    <li><a class="thumb" href="{$imgPath}{$itemPhoto->photo_name}"><img  src="{$imgPath}{$itemPhoto->photo_name}" /></a></li>
                                {/if}
                            {/foreach}
                        {elseif $annonce->marque_logo}
                            <li><a class="thumb" href="{$annonce->marque_logo}"><img  src="{$annonce->marque_logo_petit}" /></a></li>
                        {else}
                            <li><a class="thumb" href="{$j_basepath}design/front/images/no-image-home2.jpg"><img  src="{$j_basepath}design/front/images/no-image-home2.jpg" /></a></li>
                        {/if}
                        {if $annonce->distant}
                                <li><a class="thumb" href="{$annonce->Occas_Fimage}"><img  src="{$annonce->Occas_Fimage}" /></a></li>
                        {/if}
                      </ul>
                    </div>
                    <div class="clear">&nbsp;</div>
                    
                    <a href="#"  rel="prettyPhoto[pp_gal]" class="showpopin"><img alt="Zoom" src="{$j_basepath}design/front/images/zoom.png" title="Zoom" /></a>
               
                    <!--end gallery-->
                </div>
             	<div style="display:none" id="forPop">
                    {if sizeof($photo)}
                        {foreach $photo as $itemPhoto}
                            {if $itemPhoto->photo_name}
                                <a class="thumb" href="{$imgPath}{$itemPhoto->photo_name}" rel="prettyPhoto[pp_gal]">
                                    <img  src="{$imgPath}{$itemPhoto->photo_name}" width="60" />
                                </a>
                            {/if}
                        {/foreach}
                    {elseif $annonce->marque_logo}
                        <a rel="prettyPhoto[pp_gal]" class="thumb" href="{$annonce->marque_logo}"><img  src="{$annonce->marque_logo_petit}" width="60" /></a>
                    {else}
                        <a rel="prettyPhoto[pp_gal]" class="thumb" href="{$j_basepath}design/front/images/no-image-home2.jpg"><img  src="{$j_basepath}design/front/images/no-image-home2.jpg" width="60" /></a>
                    {/if}
                    {if $annonce->distant}
                        <a class="thumb" href="{$annonce->Occas_Fimage}" rel="prettyPhoto[pp_gal]"><img  src="{$annonce->Occas_Fimage}" width="60" /></a>
                    {/if}

                </div>
             	<div id="vendeur">
                    <input type="hidden" name="urlChkCaptcha" id="urlChkCaptcha" value="{jurl 'recherche~FoFiche:checkCaptcha'}" />
                	<h3>Vendeur</h3>
                	 <ul class="idTabs">
                        <li onclick='showDefault()'><a title="Acheter" class="a2" href="#idTab1" style="margin:0 0 0 10px;">Coordonnees</a></li>
                        <li class="last"><a title="Vendre" class="a1" href="#idTab2">Localiser</a></li>
                      </ul>
                      	<div id="idTab1" class="cd">
                      	<p><label>Vendeur : </label>{$annonce->typeVendeur}&nbsp;</p>
                        <p><label>Nom : </label>{$annonce->Vendeur_Prenom} {$annonce->Vendeur_Nom}&nbsp;</p>
                        <p><label>Réf.annonce : </label>{$annonce->IdOccasion} {if $annonce->Occas_Reference} - {$annonce->Occas_Reference}&nbsp;{/if}</p>
                        <p><label>Téléphone : </label>{$annonce->tel}&nbsp;</p>
                        {if !$contact}
                        <h4>Contacter le vendeur par email</h4>
                        <form action="{jurl 'recherche~FoFiche:saveAcheteur'}" method="post" style="float:left; display:block;" name="vendeur" id="vendeur" onsubmit="return false;">
                            <input type="hidden" name="idAnnnonce" value="{$annonce->IdOccasion}" />
                            <input type="hidden" name="marque" value="{$annonce->Occas_Marque}" />
                            <input type="hidden" name="modele" value="{$annonce->Occas_Modele}" />
                            <input type="hidden" name="vendeurMail" value="{$annonce->Vendeur_Email}" />
                            <input type="hidden" name="part_code" value="{$annonce->Part_Code}" />
                            <input type="hidden" name="url" id='url' value="" />

                        	<div class="rows"><label>Nom prénom : </label><input type="text" name="nom"/></div>
                            <div class="rows"><label>Téléphone : </label><input type="text" name="tel"/></div>
                            <div class="rows" id='courriel'><label>Courriel : </label><input type="text" name="email"/></div>
                            <div class="rows"><label>Message : </label><textarea id='message' name="message" cols="40" rows="7" style="width: 252px; height: 111px;"/></textarea></div>

                            <div class="rows"><label>Code de contrôle :</label>
                            <div class="code">
                                <img src="{$captchaPath}">
                            </div></div>

                            <div class="rows" id='submit_mail'><label id="errata" style="font-size:0.85em;color:#D85656;">&nbsp;</label><input type="text" class="txt_code" id="txt_code"/><input class="submit" value="" title="Envoyé" type="submit" id="send-form"/></div>
                           <div class="clear">&nbsp;</div>
                        </form>
                        {elseif ($contact == 1)}
                            <h4>Le vendeur a bien été contacté</h4>
                        {elseif ($contact == 2)}
                            <h4>L'annonce a bien été envoyée à votre ami !</h4>
                        {elseif ($contact == 3)}
                            <p><strong>{$messageCorrompu->param_content}</strong></p>
                        {/if}
                      </div>
                      <div id="idTab2" class="loc">{$google_map}</div>
                      
                     
                </div> 
            </div>
            <!--end rightItem-->
        </div>
       <!-- end prod-->
    </div><!-- fin left content 2-->
    <div id="rightContent">
        <div id="annonces2">{$oZoneDiapoAnnonce}</div>
        <div class="more_link">
            <ul>
                <li><a href="#">Vérifier la côte Argus</a></li>
                <li><a href="{$creditLink->param_content}" target="_blank" >Simulez votre credit auto</a></li>
                <li><a href="{jurl 'recherche~FoFiche:index',array('id'=>$annonce->IdOccasion)}">Comparez votre assurance auto</a></li>
            </ul>
        </div>
        <div class="wrap"><a href="#"><img title="" src="{$j_basepath}design/front/images/pub2.jpg" alt=""></a></div>
        <div class="services_pratiques">
            <div class="pratique"><h3>Pratique</h3>
                <ul>
                    <li><a id='lienSignaler' target="_blank" href="{jurl 'annonce~FoAnnonceFAQ:contact',array('id'=>$annonce->IdOccasion,'lien'=>1)}">Signaler un problème sur l'annonce</a></li>
                    <li><a href="#vendeur" onclick="showGMap()">Localiser cette voiture d'occasion</a></li>
                    <li><a href="#vendeur" id="forMail" onclick="sendAnnonce()">Envoyer l'annonce à un ami</a></li>
                    <li><a href="{jurl 'recherche~FoFiche:printAnnonce',array('id'=>$annonce->IdOccasion)}" target='_blank'>Imprimer cette annonce auto</a></li>
                    <li><a href="#">Ajouter à ma sélection</a></li>
                </ul>
            </div>
            <div class="services"><h3>Services</h3> 
                <ul>
                    <li><strong>Assurance Auto :</strong></li>
                    <li><a href="{jurl 'annonce~FoAnnonceFAQ:assuranceAuto'}"><strong>Jusqu'a -30% d'économies !</strong></a></li>
                    <li><a href="{jurl 'annonce~FoAnnonceFAQ:credit'}"><strong>Crédit auto :</strong></a></li>
                    <li><a href="{jurl 'annonce~FoAnnonceFAQ:credit'}"><strong>Accord rapide, simple, efficace !</strong></a></li>
                    <li><a href="{jurl 'annonce~FoAnnonceFAQ:assurance'}">Conseils assurance auto</a></li>
                    <li><a href="{jurl 'annonce~FoAnnonceFAQ:credit'}">Conseil crédit auto</a></li>
                </ul>
            </div>
            {if isset($essais) && sizeof($essais)}
            <div class="infos_plus"><h3>L'info en plus</h3>
                <ul>
                    {foreach $essais as $item}
                    <h4>{$item->marque_libelle} {$item->modele_libelle} {$item->ess_zVersion}</h4>
                    <li>{$item->ess_zChapeau|truncate:100}</li>
                    {/foreach}
                    <li><strong>Arnaques auto soyez prudent !</strong></li>
                </ul>
            </div>
            {/if}
         </div><!--fin service pratiques -->
      {$oZoneRightContent}
      </div><!--fin right content -->
    </div><!-- fin main -->
    <div class="clear">&nbsp;</div>
  
  {$oZoneScroll}
</div><!--  fin global -->
{$oZoneFooter}

<div id="popBlock" class="pop-up">
    <a href="#" class="close">Fermer</a>
    <!--begin gallery-->
    <div id="gallery2">
      <div id="controls2" class="controls"></div>
      <div class="slideshow-container">
        <div id="loading2" class="loader"></div>
        <div id="slideshow2" class="slideshow"></div>
      </div>
      <div id="caption2" class="caption-container"></div>
    </div>
    <div id="thumbs2" class="navigation">
      <ul class="thumbs">
          
       {if sizeof($photo)}
            {foreach $photo as $itemPhoto}
                {if $itemPhoto->photo_name}
                    <li><a class="thumb" href="{$imgPath}{$itemPhoto->photo_name}"><img  src="{$imgPath}{$itemPhoto->photo_name}" /></a></li>
                {/if}
            {/foreach}
        {elseif $annonce->marque_logo}
            <li><a class="thumb" href="{$annonce->marque_logo}"><img  src="{$annonce->marque_logo_petit}" /></a></li>
        {else}
            <li><a class="thumb" href="{$j_basepath}design/front/images/no-image-home2.jpg"><img  src="{$j_basepath}design/front/images/no-image-home2.jpg" /></a></li>
        {/if}
        {if $annonce->distant}
            <li><a class="thumb" href="{$annonce->Occas_Fimage}"><img  src="{$annonce->Occas_Fimage}" /></a></li>
        {/if}

      </ul>
    </div>
    <div class="clear">&nbsp;</div>
    <!--end gallery-->
</div>
<!-- notice indiquant au vendeur comment ajouter la vidéo : popin-->
<div id="popBlockFicheInterdit" class="pop-up cgv" style="left:287px;"> <a href="javascript:history.back()" style="float:right;margin-right:20px;">Fermer</a>
    <h2>Ce véhicule est déjà vendu !</h2>
    <p>
        <a href="{jurl 'recherche~FoRecherche:index', array('marque'=>$voiture->Occas_Marque, 'modele'=>$voiture->Occas_Modele)}">Consultez toutes nos annonces {$voiture->marque_libelle} {$voiture->modele_libelle}</a>
    </p>
    <div class="clear">&nbsp;</div>
</div>
<!-- Fin - notice indiquant au vendeur comment ajouter la vidéo : popin-->
{if isset($annonceValide) && $annonceValide==false}
<script type="text/javascript">
{literal}
    $(function(){
        $('.showFicheInterdit').click();
        $('#popBlockFicheInterdit').css('left', '287px');
    });
{/literal}
</script>
{/if}
<div id="masque"></div>
{$oZonePubHidden}
